{% extends 'base.html' %}
{% block css-content %}
    <link rel="stylesheet" href="/static/jquery-confirm/jquery-confirm.min.css">
    <link rel="stylesheet" href="/static/css/bootstrap-select.css"> 
	<script src="/static/ace/js/ace.js" type="text/javascript" charset="utf-8"></script>
	<script src="/static/ace/js/ext-language_tools.js" type="text/javascript" charset="utf-8"></script>
	<script src="/static/ace/js/ext-old_ie.js" type="text/javascript" charset="utf-8"></script>
	<script src="/static/ace/js/theme-monokai.js" type="text/javascript" charset="utf-8"></script> 
	<link href="/static/fileinput/css/fileinput.css" media="all" rel="stylesheet" type="text/css" />   
	<style type="text/css"> 
		td.details-control {
		    background: url('/static/images/details_open.png') no-repeat center center; */
		    cursor: pointer;
		}
		tr.shown td.details-control {
		    background: url('/static/images/details_close.png') no-repeat center center;
		} 
		#compile-editor-add {
			width: 100%;
			height: 200px;
	   }	
		#compile-editor-modf {
			width: 100%;
			height: 200px;
	   }	
		pre {
			overflow: auto;
			white-space: normal;
			white-space: pre-wrap; /* css-3 */
			white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
			white-space: -pre-wrap; /* Opera 4-6 */
			white-space: -o-pre-wrap; /* Opera 7 */
			word-wrap: break-word; /* Internet Explorer 5.5+ */
			font-family: Consolas, monospace;
			color: #ADFF2F;
			background-color: #000000;
		}	            	
	</style>	  
{% endblock %}
{% block page-content %}
        <div class="clearfix"></div>
		<div class="row">
              <div class="col-md-12 col-sm-12 col-xs-12">
                <div class="x_panel">
                  <div class="x_title">
                    <h2>工单处理 <small>Orders Handle</small></h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">

						<div class="row">
							<div class="row">
														
									<div class="col-lg-8">
										<legend>
											<i class="fa  fa-paper-plane"></i> 运维服务
										</legend>
										<form role="form" method="post" id="run_service_order" enctype="multipart/form-data">
											{% csrf_token %}
											<div class="item form-group">
			 									<label><font color='red'>* </font>工单主题<i class="fa fa-info-circle" data-toggle="tooltip" title="主题"></i></label>
												<input class="form-control" rows="3" id="service_order_subject" name="order_subject" required></input>
											</div>								
											<div class="item form-group">
			 									<label><font color='red'>* </font>工单内容<i class="fa fa-info-circle" data-toggle="tooltip" title="说明用途"></i></label>
												<textarea class="form-control" rows="10" id="service_order_content" name="order_content" required>业务：
	
主机：
	
服务部署类型：
	
												</textarea>
											</div>									
<!-- 											<div class="form-group">
												<label><font color='red'> </font>工单文件<i class="fa fa-info-circle" data-toggle="tooltip" title="申请上传的文件"></i></label>
												<input type="file" class="file" id="service_order_files" name="order_files" data-show-upload="false" data-show-caption="true"  value="" required/>						
											</div> -->
											<div class="item form-group">
												<label>工单周期<i class="fa fa-info-circle" data-toggle="tooltip" title="工单执行时间区间"></i></label>
											    <input type="text" id="order_time" name="order_time" class="form-control" value="" />				
											</div>		
											<div class="form-group">
												<label><font color='red'>* </font>审核人<i class="fa fa-info-circle"
													data-toggle="tooltip" title="工单发送给谁授权"></i></label> 
													<select class="form-control" data-live-search="true" id="service_order_executor" name="order_executor" required> 
														<option  value="">选择一个审核人</option> 
													</select>								
												<p class="help-block">例如：admin</p>
											</div>																																		
											<lable><button type="button" class="btn btn-default" id="servicebtn" name="btn-service-edit" disabled>申请</button></lable>
										</form>
									</div>  
									</div>
									
									<div class="row">
									
										<div class="col-lg-8">
										<h2  class="page-header">工单变更历史</h2>	
						                   <table id="ordersLogs" class="table table-hover">
						                     <thead>
						                       <tr>
						                        <th>工单ID</th>
								                <th>操作人</th>
								                <th>备注</th>
								                <th>审核状态</th>
								                <th>进度状态</th>
								                <th>操作时间</th>				                
						                       </tr>
						                     </thead>
						                     <tbody>
						                     </tbody>
						                   </table> 
						                </div>		
					                </div>										

						</div>
   
                  </div>
              </div>
        </div> 
       </div>      
<div style="visibility:hidden"><a id="scrollToTop"></a></div>                  
{% endblock %}
{% block js-content %}
	<script src="/static/jquery-confirm/jquery-confirm.min.js"></script>
    <script src="/static/datatable/datatables.net/js/jquery.dataTables.min.js"></script>
	<script src="/static/datatable/datatables.net-bs/js/dataTables.bootstrap.min.js"></script>	
	<script src="/static/js/orders/common.js"></script>
	<script src="/static/js/orders/service.js">
	<script src="/static/validator/validator.js"></script>
	<script src="/static/fileinput/js/fileinput.js" type="text/javascript"></script>
{% endblock %}